<template>
    <div id="features" class="py-1 px-6 lg:px-20   mx-0 lg:mx-20">
        <div class="grid grid-cols-12 gap-4 justify-center">
            <div class="col-span-12 text-center mt-20 mb-6">
                <div class="text-surface-900 dark:text-surface-0 font-normal mb-2 text-4xl"> 最新发布</div>
                <span class="text-muted-color text-2xl">校内最新发布的物品</span>
            </div>


            <div v-for="(good, i) in goodsList" :key="i"
                class="col-span-12 md:col-span-12 lg:col-span-6 p-0 lg:pr-8 lg:pb-8 mt-6 lg:mt-0">
                <div
                    style="height: 160px; padding: 2px; border-radius: 10px; background: linear-gradient(90deg, rgba(253, 228, 165, 0.2), rgba(187, 199, 205, 0.2)), linear-gradient(180deg, rgba(253, 228, 165, 0.2), rgba(187, 199, 205, 0.2))">
                    <div class="p-4 bg-surface-0 dark:bg-surface-900 h-full" style="border-radius: 8px">
                        <div class="flex items-center justify-center bg-yellow-200 mb-4"
                            style="width: 3.5rem; height: 3.5rem; border-radius: 10px">
                            <i class="pi pi-fw pi-users !text-2xl text-yellow-700"></i>
                        </div>
                        <h5 class="mb-2 text-surface-900 dark:text-surface-0">{{ good.title }}</h5>
                        <span class="text-surface-600 dark:text-surface-200">{{ good.desc }}</span>
                    </div>
                </div>
            </div>

        </div>
    </div>
</template>

<script setup>
import { GoodsService } from '@/service/GoodsService';
import { onMounted, ref } from 'vue';
// 定义接收父组件传递的 props
const kind = defineProps(['kind']);
const goodsList = ref([]);
const params = ref({
    kind: "",
    title: '',
    status: '',
    fromSn: "",
    limit: 10,
    offset: 0
});
onMounted(() => {
    queryGoods();
});

const queryGoods = async () => {
    params.value.title = params.value.title.trim();
    params.value.kind = kind.kind;
    try {
        const result = await GoodsService.queryGoods(params.value.kind, params.value.fromSn, params.value.title, params.value.status, params.value.limit, params.value.offset);
        if (result.Code !== 1000) {

        } else {
            goodsList.value = result.Data;
        }
    } catch (error) {

    }
};

</script>
